import React from 'react'
import { connect } from 'react-redux'

export const Detail = (props) => {
    const { shopList, addToCart } = props;
    const detail = shopList.filter(item => item.id == props.match.params.id)[0]
    return (
        <div>
            {detail.title}
            <button onClick={() => { addToCart(detail) }}>加入购物车</button>
        </div>
    )
}

const mapStateToProps = (state) => ({
    ...state
})

const mapDispatchToProps = (dispatch) => {
    return {
        addToCart: (data) => {
            dispatch({ type: 'ADD_TO_CART', data })
        }
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(Detail)
